<template>
  <div id="TopBg" :style="`position: relative; width: 100%;height: 300px;background-repeat: no-repeat;background-position: 0 0px;background-size: cover;margin-bottom:5%;
background-image: url('${$isEmpty(bannerList[0])?'':$addBaseURL(bannerList[0].name)}')`">
    <div class="container-xl">
      <img v-if="title ='/study'" src="../../../src/assets/img/studyTitle.png" style="margin-top: 17%;margin-left: 8%;">
    </div>
  </div>
</template>

<script>
  export default {
    name: "TopBg",
    data() {
      return {
        title: ''
      }
    },
    mounted() {
      this.title = this.$route.path
    }
  }
</script>

<style scoped>
  #TopBg {
    background-image: url('../../../src/assets/img/back.png');
    position: relative;
    width: 100%;
    height: 650px;
    background-repeat: no-repeat;
    background-position: 0 -40px;
    background-size: cover;
  }
</style>
